<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<meta charset="utf-8">
<head th:include="includes/add-include :: add-header"></head>
<link th:href="@{/plugin/jquery-ztree/3.5/css/metro/zTreeStyle.css}" rel="stylesheet"/>
<body class="white-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
		<form class="form-horizontal m" id="form-role-edit" th:object="${info}">
			<input id="roleId" name="roleId" type="hidden" th:field="*{roleId}"/>

			<div class="form-group">
				<label class="col-sm-3 control-label">角色编码：</label>
				<div class="col-sm-5">
					<input class="form-control" type="text" name="roleCode" id="roleCode" th:field="*{roleCode}" readonly="true">
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label ">角色名称：</label>
				<div class="col-sm-5">
					<input class="form-control" type="text" name="roleName" id="roleName" th:field="*{roleName}" readonly="true"/>
				</div>
			</div>

			<div class="form-group" id="roleRule" style="display: none">
				<label class="col-sm-3 control-label">数据权限</label>
				<div class="col-sm-5">
					<div id="roleMenuTrees" class="ztree"></div>
				</div>
			</div>
		</form>
	</div>
	<div th:include="includes/add-include :: add-footer"></div>
	<script th:src="@{/plugin/jquery-ztree/3.5/js/jquery.ztree.all-3.5.js}"></script>
	<script type="text/javascript">
	
	    $(function() {
			var url = ctx + "system/menu/roleMenuTreeData?roleId=" + $("#roleId").val();
			var options = {
				id: "roleMenuTrees",
		        url: url,
		        check: { enable: true, nocheckInherit: true, chkboxType: { "Y": "ps", "N": "ps" } },
		        expandLevel: 2
		    };
			$.tree.init(options);
            $("#roleRule").show();
	    });

		function submitHandler() {
			var roleId = $("input[name='roleId']").val();
            var menuIds = $.tree.getCheckedNodes();
			var data = {"roleId": roleId, "menuIds": menuIds};
			$.operate.save(ctx + "system/role/author", JSON.stringify(data));
		}
	</script>
</body>
</html>
